<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>婚纱礼服详情页</title>

    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/dress.css">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.1/jquery.js"></script>
    <script src="js/common.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.1/jquery.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
    <script src="https://unpkg.com/swiper/swiper-bundle.min.js">
    </script>
</head>

<body>
    <!-- 头部 -->
    <div class="header">
        <div class="header-c w">
            <div class="veronica">
                <img src="img/index-img/VERONICA.png" alt="">
                <p class="date">1820-2018</p>
            </div>
            <ul class="nav">
                <li class="nav-item">
                    <a href="index.html">首页</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="dress.html">婚纱礼服</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="jew.html">珠宝配饰</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="activities.html">最新活动</a>
                    <span></span>
                </li>
                <li class="nav-item m0">
                    <a href="about.html">关于我们</a>
                    <span></span>
                </li>
            </ul>
        </div>
    </div>
    <!-- 移动端头部 -->
    <div class="header-m">
        <div class="header-c w">
            <div class="veronica">
                <img src="img/index-img/VERONICA.png" alt="">
                <p class="date">1820-2018</p>
            </div>
            <ul class="nav">
                <li class="nav-item">
                    <a href="index.html">首页</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="dress.html">婚纱礼服</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="jew.html">珠宝配饰</a>
                    <span></span>
                </li>
                <li class="nav-item">
                    <a href="activities.html">最新活动</a>
                    <span></span>
                </li>
                <li class="nav-item m0">
                    <a href="about.html">关于我们</a>
                    <span></span>
                </li>
            </ul>
            <!-- 移动端header汉堡包 -->
            <div class="box">
                <div class="line">

                </div>
                <div class="line">

                </div>
                <div class="line">

                </div>
            </div>
        </div>
    </div>
    <div class="content-filter">
        <!-- 内容区 -->
        <div class="content">
            <div class="content-c w">
                <div class="box1">
                    <img src="img/dress-img/dress1.png" alt="">
                    <div class="box1-r">
                        <!-- 右边竖线加上title标题部分 -->
                        <div class="title clr">
                            <div class="line"></div>
                            <div class="dress-name">
                                <p class="t">一字肩拖尾主纱</p>
                                <p class="b">HER STYLE</p>
                                <p class="price">$5389.00</p>
                                <p class="type">白色 / M / VK2531</p>
                            </div>
                        </div>

                        <p class="des">浅色象牙白缎面婚纱，手工镶嵌金色和银色Chantilly蕾丝，背面饰有镂空的华丽。
                        </p>
                        <a class="bt" href="">立即预约</a>
                        <div class="line-b"></div>
                    </div>
                </div>
                <div class="box2">
                    <img src="img/dress-img/dress2.png" alt="">
                    <p>这薄纱在皇家纱婚纱由著名思想Martina Liana的首席创意官，Martine Harris，有一个身影奉承捻胸衣和传统教堂的火车。大胆的钻石水晶点缀的领口，上背部和腰部。背部拉链。选择从石头和象牙薄纱在香槟皇家纱，象牙薄纱在皇家象牙白色纱纱，或皇家白色的薄纱。
                    </p>
                    <div class="size">
                        尺码： s / m <br> 颜色： 白色
                    </div>
                </div>
            </div>
        </div>
        <!-- 婚纱展示 -->
        <div class="dress">
            <div class="dress-c clr swiper-container">
                <div class="new">新品/NEW</div>
                <div class="old">往季</div>
                <ul class="dre clr swiper-wrapper ">
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <li class="dre-item swiper-slide"></li>
                    <!-- <li class="dre-item swiper-slide"></li> -->
                </ul>
                <div class="arr arr-l" href=""> </div>
                <div class="arr arr-r" href=""> </div>
                <div class="swiper-pagination"></div>
                <a class="more" href="">MORE</a>
            </div>
        </div>
        <!-- 底部 加入我们 -->
        <div class="footer">
            <div class="footer-c w">
                <div class="footer-l ">
                    <p class="footer-t">网站备案号：豫ICP备110121210号</p>
                    <p class="footer-b">增值电信业务经营许可证号：豫B2-20100033</p>
                </div>
                <ul class="footer-r ">
                    <li class="footer-item"> &copy;2018 VERONICA</li>
                    <li class="footer-item">联系我们</li>
                    <li class="footer-item">加入我们</li>
                </ul>
            </div>
        </div>
    </div>
    <script>
        $(function() {
            var swiper = new Swiper('.swiper-container', {
                slidesPerView: 5.8,
                navigation: {
                    nextEl: '.arr-r',
                    prevEl: '.arr-l',
                },
                // pagination: {
                //     el: '.swiper-pagination',
                //     clickable: true,
                // },
            });
        })
    </script>
</body>

</html>